require("./applyAgent.css");
$(function () {

    $('.check').iCheck({
        checkboxClass: 'iradio_square-red'
    });

    $("#city-picker").cityPicker({
        toolbarTemplate: '<header class="bar bar-nav">\
    <button class="button button-link pull-right close-picker">确定</button>\
    <h1 class="title">选择收货地址</h1>\
    </header>'
    });
    $('#submitBtn').click(function () {

        // let referer = $(this).data('referer');
        let data = getFormData();
        if (!validateForm(data)) {
            return false;
        }
         console.log(data)
        $.ajax({
            type: "post",
            url: _applyAgentUrl,
            data: data,
            dataType: "json",
            success: function (res) {
                if (res.rel == 1) {
                    $.toast(res.msg);
                    location.reload();
                }else{
                    $.toast(res.msg);
                }
            }
        });

    });
    //获取提交数据
    const getFormData = () => {
        let dataArr = $('form').serializeArray();
       
        let data = {};
        $.each(dataArr, function (key, val) {
            data[val.name] = $.trim(val.value);
        });
        return data;
    };
    //表单验证
    const validateForm = (data) => {
        const config = [{
                name: 'strpid',
                label: '邀请码',
                rules: (value, data) => {
                    if (value == '') {
                        return {
                            validated: false,
                            msg: '邀请码不能为空'
                        };
                    }
                    return {
                        validated: true
                    };
                }
            }, {
                name: 'myadd',
                label: '所在地区',
                rules: (value, data) => {
                    if (value == '') {
                        return {
                            validated: false,
                            msg: '所在地区不能为空'
                        };
                    }
                    return {
                        validated: true
                    };
                }
            }, {
                name: 'truename',
                label: '姓名',
                rules: (value, data) => {
                    if (value == '') {
                        return {
                            validated: false,
                            msg: '申请人姓名不能为空'
                        };
                    }
                    return {
                        validated: true
                    };
                }
            },

            {
                name: 'mobile',
                label: '手机',
                rules: (value, data) => {
                    let regex = /^(0|86|17951)?(13[0-9]|15[012356789]|17[0-9]|18[0-9]|14[57])[0-9]{8}$/;
                    if (value == '') {
                        return {
                            validated: false,
                            msg: '手机不能为空'
                        };
                    }
                    if (!regex.test(value)) {
                        return {
                            validated: false,
                            msg: '手机格式不正确'
                        };
                    }
                    return {
                        validated: true
                    };
                }
            }, {
                name: 'wxid',
                label: '微信',
                rules: (value, data) => {
                    if (value == '') {
                        return {
                            validated: false,
                            msg: '微信号不能为空'
                        };
                    }
                    return {
                        validated: true
                    };
                }
            },

            {
                name: 'cardid',
                label: '身份证',
                rules: (value, data) => {
                    let cardreg = /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/;
                    if (value == '') {
                        return {
                            validated: false,
                            msg: '身份证号不能为空'
                        };
                    }
                    if (!cardreg.test(value)) {
                        return {
                            validated: false,
                            msg: '身份证格式不正确'
                        };
                    }
                    return {
                        validated: true
                    };
                }
            }, {
                name: 'accept',
                label: '同意接受',
                rules: (value, data) => {
                    if (!value) {
                        return {
                            validated: false,
                            msg: '请同意'
                        };
                    }
                    return {
                        validated: true
                    };
                }
            }
        ];


        let checked = true;
        $.each(config, function (key, val) {
            let field = val.name;
            let res = val.rules(data[field], data);
            if (!res.validated) {
                checked = false;
                $.toast(res.msg);
                return false;
            }
        });
        if (!checked) {
            return false;
        }
        return true;
    };

    uploadImg('#picker1', '#cardone'); // 身份证正面
    uploadImg('#picker2', '#cardtwo'); // 身份证返面

    /**
     * 图片上传
     */
    function uploadImg(elem, target) {

        var $list = $(elem).siblings('.list');
        var fileCount = 0;
        var ratio = window.devicePixelRatio || 1;
        var thumbnailWidth = 100 * ratio;
        var thumbnailHeight = 100 * ratio;

        var uploader = WebUploader.create({

            // 选完文件后，是否自动上传。
            auto: true,

            // swf文件路径
            swf: _comResUrl + 'webup/Uploader.swf',

            // 文件接收服务端。
            server:_uploadImgtUrl,

            // 内部根据当前运行是创建，可能是input元素，也可能是flash.
            pick: {
                id: elem,
                multiple: false
            },
            chunked:true,
            chunkSize:1048576,
            fileSingleSizeLimit:3145728,
            compress:{
                width:720,
            // 图片质量，只有type为`image/jpeg`的时候才有效。
            quality: 90,

            // 是否允许放大，如果想要生成小图的时候不失真，此选项应该设置为false.
            allowMagnify: false,

            // 是否允许裁剪。
            crop: false,

            // 是否保留头部meta信息。
            preserveHeaders: true,

            // 如果发现压缩后文件大小比原来还大，则使用原来图片
            // 此属性可能会影响图片自动纠正功能
            noCompressIfLarger: false,

            // 单位字节，如果图片大小小于此值，不会采用压缩。
            compressSize: 1048576
        },

            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/jpg,image/jpeg,image/png'
            }
        });


        uploader.on('beforeFileQueued',function (file) {
            if(file.size >=3*1024*1024){
                $.toast('图片不能超过3M');
                return false;
            }
        });

        // 当有文件添加进来的时候
        uploader.on('fileQueued', function (file) {

            var $li = $(
                    '<div id="' + file.id + '" class="file-item thumbnail">' +
                    '<img>' +
                    '</div>'
                ),
                $img = $li.find('img');


            // $list为容器jQuery实例
            $list.html($li);

            // 创建缩略图
            // 如果为非图片文件，可以不用调用此方法。
            // thumbnailWidth x thumbnailHeight 为 100 x 100
            uploader.makeThumb(file, function (error, src) {
                if (error) {
                    $img.replaceWith('<span>不能预览</span>');
                    return;
                }

                $img.attr('src', src);
            }, thumbnailWidth, thumbnailHeight);
        });




        // 文件上传过程中创建进度条实时显示。
        uploader.on('uploadProgress', function (file, percentage) {

            var $li = $('#' + file.id),
                $percent = $li.find('.progress span');

            // 避免重复创建
            if (!$percent.length) {
                $percent = $('<p class="progress"><span></span></p>')
                    .appendTo($li)
                    .find('span');
            }

            $percent.css('width', percentage * 100 + '%');
        });

        // 文件上传成功，给item添加成功class, 用样式标记上传成功。
        uploader.on('uploadSuccess', function (file, ret) {

            if(ret.rel==1){
                $('#' + file.id).addClass('upload-state-done');
                $(target).val(ret.result);
                $.toast(ret.msg);
            }else{
                $.toast(ret.msg);
            }

        });

        // 文件上传失败，显示上传出错。
        uploader.on('uploadError', function (file) {
            var $li = $('#' + file.id),
                $error = $li.find('div.error');

            // 避免重复创建
            if (!$error.length) {
                $error = $('<div class="error"></div>').appendTo($li);
            }

            $error.remove();
            $.toast('上传失败');
        });

        // 完成上传完了，成功或者失败，先删除进度条。
        uploader.on('uploadComplete', function (file) {
            $('#' + file.id).find('.progress').remove();
        });


    }





})